import React from 'react';
import { Skeleton } from 'antd';
import { useRequest } from '@/hooks';

import GroupingOfAttendance from '@/pages/Organization/EmployeeManage/components/SupervisorProfile/GroupingOfAttendance';
import { getGroupingOfAttendanceData } from '@/pages/Organization/EmployeeManage/services';

const Attendance = ({ employeeCode }) => {
    const { data = {}, loading: groupingOfAttendanceLoading } = useRequest(
        () => getGroupingOfAttendanceData(employeeCode),
        {
            ready: !!employeeCode,
            refreshDeps: [employeeCode]
        }
    );
    return (
        <Skeleton loading={groupingOfAttendanceLoading}>
            <GroupingOfAttendance data={data} withTitle={false} />
        </Skeleton>
    );
};

export default Attendance;
